<template>
  <NavigationBar>
    <div class="draft">
      <Row :gutter="16">
        <i-col span="12">
          <List  style="margin-left: 20px">
            <ListItem v-for="(item, index) in drafts" :key="index">
              <ListItemMeta avatar="http://dd.ddandang.top/blog/images/images.jpg" :title="item.title" :description="item.gmtModified | formatTime" />
              <template slot="action">
                <li>
                  <a href="">查看</a>
                </li>
                <li>
                  <a @click="edit(index)">编辑</a>
                </li>
                <li>
                  <a @click="deleteDraft(index)" style="color: red">删除</a>
                </li>
              </template>
            </ListItem>
          </List>
        </i-col>
      </Row>
    </div>
  </NavigationBar>
</template>

<script>
  import NavigationBar from "@/components/common/NavigationBar";
  import {listDraft, deleteDraft} from "@/network/draft";
  import moment from "moment";
  export default {
    name: "Draft",
    data() {
      return {
        drafts: [],
        categories: []
      }
    },
    components: {
      NavigationBar
    },
    mounted() {
      //获取草稿箱
      this.listDraft();
      // //获取全部分类
      // this.allCategories();
    },
    methods: {
      listDraft() {
        listDraft().then(res => {
          this.drafts = res.data.drafts;
        }).catch(() => {
        })
      },
      // //获取全部分类
      // allCategories() {
      //   allCategories().then(res => {
      //     this.categories = res.data.categoriesList;
      //   }).catch(err => {
      //     console.log(err);
      //   })
      // },
      //编辑
      edit(index) {
        this.$router.push({
          name: 'Write',
          params: {
            id: this.drafts[index].id,
            articleId: this.drafts[index].articleId,
            title: this.drafts[index].title,
            contentMd: this.drafts[index].contentMd
          }
        })
      },
      //删除草稿
      deleteDraft(index) {
        this.$Modal.confirm({
          title: '确认删除该草稿？',
          onOk: () => {
            deleteDraft(this.drafts[index].id).then(res => {
              if(res.code === 2000) {
                this.$Message.success("删除成功！");
                this.drafts.splice(index, 1);
              }
            })
          },
          onCancel: () => {
          }
        });
      }

    },
    filters: {
      formatTime: function (date) {
        return moment(date).format("MMMM Do YYYY, h:mm:ss a");
      }
    }
  }
</script>

<style scoped>

</style>